<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <link rel="shortcut icon" href="/static/pic/index.png">
    {% block title %}

    {% endblock %}
    <link rel="stylesheet" href="/static/dist/css/bootstrap.css">
    <style>
        *{
            margin: 0;
            padding: 0;
        }

        #top-pic{
            width: 20px;
            height: 20px;
        }
        .navbar{
            border-radius: 0;
            z-index: 999;
        }
        .add-link{
            float: left;
        }
        {#尾部#}
        div.footer{
            position: fixed;
            bottom: 20px;
            left: 50%;
            margin-left: -135px;
            margin-top: 0;
            text-align: center;
            font-weight: 700;
            font-size: 16px;
            color: #000000;
            z-index: 1001;
        }
        {#背景图片#}
        .background{
            position: fixed;
            top: 0;
            z-index: 0;
        }
        .img-rounded{
            width: 200px;
            height: 200px;
            box-shadow: 5px 5px 4px #1b6d85;
        }
        .main{
            margin-top: 50px;
        }
        a.link{
            position: relative;
            box-shadow: 10px 10px 5px #888888;
        }
        .link_title{
            position: absolute;
            top:-150px;
            left: 130px;
        }
        .mid{
            left: 113px;
        }
        .title{
            margin-bottom: 50px;
        }
        .sep{
            font-size: 25px;
        }
        .theme{
            float: left;
            margin-top: 12px;
            color: white;
        }
        {#主页面的三大查询标题#}
        a.link:hover{
            bottom:-5px;
            box-shadow: none;
        }
        {#查询页面#}
        .nav-pills li{
            float: right;
            margin-top: 5px;
        }
        td a{
            display: block;
            margin-left: 15px;
        }
        .table{
            background-color: #d2b615;
        }
        table.table thead tr th{
            text-align: center;
            font-size: 20px;
        }
        table.table tbody tr td{
            text-align: center;
            line-height: 35px;
        }
        {#分页器#}
        .pagination{
            position: fixed;
            bottom: 60px;
            left: 50%;
            margin-left: -305px;
        }
        .pagination li a{
            width: 42px;
        }
        .pagination li a.ends{
            width: 80px;
        }
        {#添加页面#}
        .error{
            color: red;
        }
        .add-btn{
            margin: 20px auto 0;
            display: block;
        }
        .input-form{
            margin-top: 30px;
            overflow: hidden;
            padding: 15px;
            border-radius: 5px;
            background-color: #d2b615;
        }
    </style>
</head>
<body>
{#通天导航栏#}
    <nav class="navbar navbar-default navbar-inverse ">
        <div class="container">
            <div class="navbar-header">
                <a class="navbar-brand">
                    <img alt="Brand" src="/static/pic/index.png" id="top-pic">
                </a>
            </div>
{#            导航栏添加链接#}
            {% block topbar%}

            {% endblock %}
            <ul class="nav nav-pills">
                <li role="presentation" class="login-status"><a href="#" data-toggle="modal" data-target="#login" class="login-btn login">登陆</a></li>
                <li role="presentation" class="hidden login-out"><a href="/logout/">注销</a></li>
                <li class="sep">|</li>
                <li role="presentation" class="reg"><a href="#" data-toggle="modal" data-target="#register" class="login-btn register">注册</a></li>
                <li role="presentation" class="hidden login-user"><a></a></li>
                <li class="sep">|</li>
                <li role="presentation"><a href="/index/">返回首页</a></li>
            </ul>
        </div>
    </nav>
{#主体#}
    <div class="background">
        <img src="/static/pic/backgroundimg.jpg" alt="">
    </div>
        {% block main %}

        {% endblock %}

         {% block paginator %}

         {% endblock %}

{#尾部#}
    <div class="footer">Copyright © 2018 todolist by 游小刀</div>

</body>
<script src="/static/jquery-3.2.1.min.js"></script>
<script src="/static/session.js"></script>
<script src="/static/dist/js/bootstrap.js"></script>
<script>
    $(function () {
        {#判断是不是登陆状态#}
        login_user=$.session.get('user');
        if(login_user){
            $('.login-username a').text(login_user);
            console.log(login_user);
            $('#login').removeClass('in').hide();
            $('.login-user a').text('欢迎'+login_user);
            $('nav .login').addClass('hidden');
            $('nav .register').addClass('hidden');
            $('nav .login-out').removeClass('hidden');
            $('nav .login-user').removeClass('hidden');
        }
    {#分页器居中#}
    width=$(".pagination").width();
    $(".pagination").css("margin-left",-width/2);

    {#编辑页面添加便签value#}
    title='{{ title }}';
    if(title==='book') {
        {#编辑图书#}
        $('#id_title').val('{{ edit_obj.title }}');
        $('#id_price').val('{{ edit_obj.price }}');
        {#下拉菜单和多选动态添加selected#}
        if ('{{ book_author_list }}'.length > 0) {
            $.each({{ book_author_list }}, function () {
                $("#id_author option[value=" + this + "]").attr('selected', 'selected');
            });
        }
        var publish_op_value = '{{ edit_obj.publish.pk }}';
        if (publish_op_value) {
            $("#id_publish option[value = " + publish_op_value + ']').attr('selected', 'selected');
        }
        ;
        var year = '{{ edit_obj.pub_date|date:'Y' }}';
        var month = '{{ edit_obj.pub_date|date:'m' }}';
        var day = '{{ edit_obj.pub_date|date:'d' }}';
        month=parseInt(month);
        day=parseInt(day);
        console.log(year,month,day);
        if (year || month || day) {
            $("#id_pub_data_month option[value = " + month + "]").attr('selected', 'selected');
            $("#id_pub_data_day option[value = " + day + "]").attr('selected', 'selected');
            $("#id_pub_data_year option[value = " + year + "]").attr('selected', 'selected');
        }
    }
        else if(title==='publish') {
            {#编辑出版社#}
            console.log(123);
            $('#id_name').val('{{ edit_obj.name }}');
            $('#id_tel').val('{{ edit_obj.tel }}');
            $('#id_addr').val('{{ edit_obj.addr }}')
        }
    else if(title==='author'){
         {#编辑作家#}
        $('#id_name').val('{{ edit_obj.name }}');
        $('#id_tel').val('{{ edit_obj.author.tel }}');
        $('#id_addr').val('{{ edit_obj.author.addr }}');
        var year_b='{{ edit_obj.author.birthday.year }}';
        var month_b='{{ edit_obj.author.birthday.month }}';
        var day_b='{{ edit_obj.author.birthday.day }}';
        var gender='{{ edit_obj.gender }}';

        if(year_b || month_b || day_b || gender){
            $("#id_birthday_month option[value = "+month_b+"]").attr('selected','selected');
            $("#id_birthday_day option[value = "+day_b+"]").attr('selected','selected');
            $("#id_birthday_year option[value = "+year_b+"]").attr('selected','selected');
            $("#id_gender option[value = "+gender+"]").attr('selected','selected');
        }
    }
        {#注销#}
        $('.login-out').click(function () {
            $.session.remove('user');

        });
    })
</script>
</html>